﻿<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta http-equiv="pragma" content="no-cache" />
    <meta http-equiv="Cache-Control" content="no-cache, must-revalidate" />
    <meta http-equiv="expires" content="0" />
    <title>FaceCat</title>
</head>
<body>
    <canvas id="mycanvas" width="1000" height="700" style="position: fixed; left: 0px; top: 0px;"/>
    <script type="text/javascript" src="facecat.js"></script>
    <script type="text/javascript">
        let canvas = document.getElementById("mycanvas"); //绘图区域
        let context = canvas.getContext("2d"); //绘图上下文
        canvas.width = window.innerWidth;
        canvas.height = window.innerHeight;
        let gPaint = new FCPaint(); //绘图对象
        gPaint.canvas = canvas;
        scaleCanvas(gPaint);
        //判断是否移动端
        gPaint.isMobile = isMobileMode();
        if (gPaint.isMobile) {
            gPaint.scaleFactorX = 2.5;
            gPaint.scaleFactorY = 2.5;
        }
        //判断主题色
        gPaint.defaultUIStyle = "light";
        addDefaultEvent(canvas, gPaint);

        /*
        * 点击方法
        * view:视图
        * firstTouch:是否第一次触摸
        * firstPoint:第一次触摸的坐标
        * secondTouch:是否第二次触摸
        * secondPoint:第二次触摸的坐标
        * clicks:点击次数
        */
        gPaint.onClick = function (view, firstTouch, firstPoint, secondTouch, secondPoint, clicks) {
            onClickDefault(view, firstTouch, firstPoint, secondTouch, secondPoint, clicks);
            if (view.viewType == "menuitem") {
                console.log(view.text + "=" + view.value);
            }
        };

        /*
        * 鼠标按下实现方法
        * view:视图
        * mp:坐标
        * button:按钮
        * clicks:点击次数
        * delta:滚轮值
        */
        gPaint.onMouseDown = function (view, mp, buttons, clicks, delta) {
            onMouseDownDefault(view, mp, buttons, clicks, delta);
            if (buttons == 2) {
                gMenu.location = view.paint.touchDownPoint;
                gMenu.visible = true;
                adjustMenu(gMenu);
                invalidate(gMenu.paint);
            }
        };

        /*
         * 重置大小
         */
        let resizeAll = function () {
            try {
                canvas.width = document.documentElement.clientWidth;
                canvas.height = document.documentElement.clientHeight;
                scaleCanvas(gPaint);
                updateViewDefault(gPaint.views);
            } catch (err) {
                //alert(err);
            }
            invalidate(gPaint);
        };

        /*
        * 监听大小改变
        */
        window.onresize = function () {
            resizeAll();
        };

        /*
        * 旋转监听
        */
        window.onorientationchange = function () {
            resizeAll();
        };

        document.oncontextmenu = function (event) {
            if (window.Event) {
                if (event.which == 2 || event.which == 3) {
                    return false;
                }
            }
            else {
                if (event.button == 2 || event.button == 3) {
                    event.cancelBubble = true;
                    event.returnValue = false;
                    return false;
                }
            }
        };

        //解析加载XML
        let xml = `<?xml version="1.0" encoding="utf-8"?>
        <html xmlns="facecat">
          <head>
          </head>
          <body>
            <div dock="fill">
            </div>
          </body>
        </html>
        `;
        renderFaceCat(gPaint, xml);
        let gMenu = new FCMenu();
        gMenu.size = new FCSize(100, 300);
        addView(gMenu, gPaint);
        for (let i = 0; i < 10; i++) {
            let menuItem = new FCMenuItem();
            menuItem.text = "菜单项" + (i + 1);
            menuItem.value = i + 1;
            addMenuItem(menuItem, gMenu);
            for (let j = 0; j < 10; j++) {
                let subMenuItem = new FCMenuItem();
                subMenuItem.text = "子菜单项" + (j + 1);
                subMenuItem.value = j + 1;
                addMenuItemToParent(subMenuItem, menuItem);
                for (let z = 0; z < 10; z++) {
                    let sunMenuItem = new FCMenuItem();
                    sunMenuItem.text = "孙菜单项" + (z + 1);
                    sunMenuItem.value = z + 1;
                    addMenuItemToParent(sunMenuItem, subMenuItem);
                }
            }
        }
    </script>
</body>
</html>
